<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>layui</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="../../css/layui.css" media="all">
		<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
		<script type="text/javascript" src="../../js/jquery.min.js"></script>
		<script type="text/javascript" src="../../js/vue.min.js"></script>
	</head>

	<body>
		<div class="layui-container">

			<div class="layui-row">
				<div id="app">
					<fieldset class="layui-elem-field site-demo-button" style="margin-top: 30px;">
						<legend>重点课程</legend>
						<div style="margin-top: 15px; margin-bottom: 35px; margin-left: 20px; ">
							<template v-for="course in courses">
								<span v-if="selectCourse==course.couId" style="border:2px solid #FFFFFF;">
							<button  class="layui-btn layui-btn-radius" @click="selectCourse=null;getLists(selectCourse)">{{course.couName}}</button>
						</span>
								<span v-if="selectCourse!=course.couId" style="border:2px solid #FFFFFF;">
							<button  class="layui-btn layui-btn-primary layui-btn-radius" @click="selectCourse=course.couId;getLists(selectCourse)">{{course.couName}}</button>
						</span>
							</template>

							<button data-method="offset" data-type="auto" class="layui-btn layui-btn-primary layui-btn-radius" onclick="add()">+</button>

						</div>

						<div class="demoTable" style="margin-bottom: 10px;">

							<div class="layui-inline">
								<input class="layui-input" name="selectExample" id="demoReload" autocomplete="off" placeholder="支持课程名、实验名" v-model="selectExample" style="margin-left: 20px;">
							</div>
							<button class="layui-btn" data-type="reload" @click="getListByExample()" style="margin-left: 20px;">搜索</button>
						</div>
					</fieldset>

					<div style="margin-top: 15px;">
						<table class="layui-table" style="text-align: center;">
							<colgroup>
								<col width="150">
								<col width="200">
								<col width="300">
								<col width="300">
								<col width="200">

							</colgroup>
							<thead>
								<tr>

									<th style="text-align: center;">课程名</th>
									<th style="text-align: center;">实验名</th>
									<th style="text-align: center;">实验内容</th>
									<th style="text-align: center;">预习资料</th>
									<!--<th style="text-align: center;">备注</th>-->
									<th style="text-align: center;">操作</th>
								</tr>
							</thead>
							<tbody>
								<template v-for="expshow in expshows">

									<tr>
										<td>{{expshow.course.couName}}</td>
										<td>{{expshow.experiment.expName}}</td>
										<td>{{expshow.experiment.oldName}}</td>
										<td>
											<p align="left" v-for="material in expshow.material">{{material.oldName}}</p>
										</td>
										<!--<td>备注</td>-->

										<td align="left">
											<a href="javascript:void(0)"><button class="layui-btn" type="button" @click="edit(expshow.experiment.expId)">编辑</button></a>
											<a href="javascript:void(0)"><button class="layui-btn" type="button" @click="check(expshow.experiment)" v-if="expshow.experiment.sameState==0">核算</button></a>
											<!--<button class="layui-btn" v-if="expshow.isDel==1" @click="del(expshow.experiment.expId)">删除</button>-->
											<!--<a class="layui-btn layui-btn-xs" @click="selectexp=expshow.expId;selectexpmin=expmin.claId;">编辑</a>-->
											<!--<a class="layui-btn layui-btn-danger layui-btn-xs" @click="del(expshow.expId,expmin.claId)">删除</a>-->
										</td>
									</tr>
								</template>

							</tbody>

						</table>

					</div>
				</div>

			</div>
		</div>
		<script src="../../layui.js" charset="utf-8"></script>
		<script src="../../js/jquery.cookie.js"></script>
		<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->

		<script>
			$.ajax({
				type: "get",
				url: "http://localhost:8080/teacher/experiment/nothing.do",
				async: false,
				dataType: "json",
				data: {
					uid: $.cookie("uid")
				},
				success: function(data) {
					//alert(data.info);
					if(data.info == '404') {
						window.location.href = "../login/teacherlogin.html";
					}
				}
			});
			var courses;
			$.ajax({
				type: "get",
				url: "http://localhost:8080/teacher/course/list.do",
				dataType: "json",
				async: false,
				data: {
					uid: $.cookie("uid")
				},
				success: function(data) {
					courses = data;
				}
			});
			var expshows;
			//

			function getList(selectCourse, selectExample, show) {
				$.ajax({
					type: "get",
					url: "http://localhost:8080/teacher/experiment/expList.do",
					data: {
						courses: courses,
						selectCourse: selectCourse,
						selectExample: selectExample,
						show: show,
						uid: $.cookie("uid")
					},
					dataType: "json",
					async: false,
					success: function(data) {
						expshows = data;
					}
				});
			}
			getList();
			//console.log(expshows);
			var vue = new Vue({
				el: "#app",
				data: {
					expshows: expshows,
					courses: courses,
					selectCourse: 0,
					selectExample: null,
					show: false

				},
				computed: {},
				methods: {
					showMore: function(expId, claId) {
						//alert(expId + " " + claId);
						window.location.href = "operateInfo.html?expId=" + expId + "&claId=" + claId;
					},
					edit: function(expId) {
						window.location.href = "expchange.html?expId=" + expId;

					},
					getLists: function(selectCourse) {
						this.selectExample = null;
						getList(selectCourse, this.selectExample);
						vue.expshows = expshows;
					},
					getListByExample: function() {
						this.selectCourse = 0;
						//alert(this.selectExample);
						getList(null, this.selectExample);
						vue.expshows = expshows;
					},
					del: function(expId) {
						$.ajax({
							type: "get",
							url: "http://localhost:8080/teacher/experiment/delexp.do?expId=" + expId,
							async: false,
							data: {
								uid: $.cookie("uid")
							},
							success: function(data) {
								layer.msg("删除成功");
							}
						});
					},
					check: function(expx) {
						//信息框-例2
						
                        var expId=expx.expId;
                       
                        //alert(expId);
						layer.msg('您确定要对该门实验课学生文件进行查重吗？（此操作只可以进行一次！！）', {
							time: 0 //不自动关闭
								,
							btn: ['好的', '关闭'],
							yes: function(index) {
								 expx.sameState=1;                                  
								vue.click=false;
								layer.close(index);
								layer.load(2);
								//此处演示关闭
								setTimeout(function() {
									layer.closeAll('loading');
									$.ajax({
										type: "get",
										url: "http://localhost:8080/teacher/experiment/check.do?expid=" + expId,
										data: {
											uid: $.cookie("uid")
										},
										async: true,
										success: function(data) {
											//alert(data);
											if(data=="success"){
												var info=expx.expName+"查重成功";
												layer.msg(info, {
												icon: 6
											});
												expx.sameState=1;
											}
											
										},
										error: function() {
											console.log("error");
										}
									});
								}, 2000);

							},
							btn2: function(index) {
								layer.close();
								 expx.sameState=0;   
							}
						});
					}

				}
			});
			layui.use(['form', 'laypage', 'layer', 'laydate'], function() {
				var form = layui.form,
					laypage = layui.laypage,
					layer = layui.layer,
					laydate = layui.laydate;
				//多窗口模式，层叠置顶								
			});

			function add() {

				layer.open({
					id: 'insert-form',
					title: '添加新课程',
					type: 2,
					content: '../exp/addCoursemin.html',
					area: ['800px', '500px'],
					btn: ['立即提交', '关闭'],
					shadeClose: true,
					yes: function(index) {
						insertSubmit();
						location.reload(true);
					}, //关闭弹层时会调刷新本页面
					btn2: function(index) {
						layer.close(index);
					}

				});
			};

			function insertSubmit() {
				var frameId = document.getElementById('insert-form').getElementsByTagName("iframe")[0].id;
				$('#' + frameId)[0].contentWindow.mySubmit();
			}
		</script>

	</body>

</html>